<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui">
    <ui:composition template="/template_bill.xhtml"
                    >
        <ui:define name="body">
            <h:panelGroup id="messagePanel" layout="block">
                <h:messages errorStyle="color: red" infoStyle="color: green" layout="table"/>
            </h:panelGroup>
            <!-- start of the photos bar -->
            <div class="clear"></div>

            <!-- start of the search form -->
            <h:form >
                <h:panelGrid columns="2" >
                    <h:outputLabel value="اسم المورد"/>
                    <p:autoComplete  value="#{exporterController.exporterName}" completeMethod="#{exporterController.autocomplete}" ></p:autoComplete>
                    <h:outputLabel value="من تاريخ"/>
                    <p:calendar value="#{exporterController.fromDate}" id="startDate" showOn="button" pattern="dd/MM/yyyy" >
                    </p:calendar>
                    <h:outputLabel value="الي تاريخ"/>
                    <p:calendar value="#{exporterController.toDate}" id="endDate" showOn="button" pattern="dd/MM/yyyy" >
                    </p:calendar>
                </h:panelGrid>
                <br />
                <div class="clear"></div>
                <h:commandButton action="#{exporterController.prepareBillItemList}" styleClass="btn-primary btn" value="عرض"/>
            </h:form>
            <!-- end of the search form -->


            <!-- start of the table -->
            <h:form styleClass="jsfcrud_list_form">   
                <h:panelGroup rendered="#{exporterController.bill_items != null }">
                    <p:dataTable value="#{exporterController.bill_items}" var="item" paginator="true" rows="50"  
                                 paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"  
                                 rowsPerPageTemplate="50,100,150">

                        <f:facet name="header">  
                            جرد الموردين
                        </f:facet>
                        <p:column>
                            <f:facet name="header">
                                <h:outputText value="رقم الفاتوره"/>
                            </f:facet>
                            <h:outputText value="#{item.billID.billNumber}"/>
                        </p:column>

                        <p:column>
                            <f:facet name="header">
                                <h:outputText value="رقم الدفتر"/>
                            </f:facet>
                            <h:outputText value="#{item.billID.docNum}"/>
                        </p:column>

                        <p:column>
                            <f:facet name="header">
                                <h:outputText value="المنتج"/>
                            </f:facet>
                            <h:outputText value="#{item.itemID.itemName}"/>
                        </p:column>

                        <p:column>
                            <f:facet name="header">
                                <h:outputText value="المصنع"/>
                            </f:facet>
                            <h:outputText value="#{item.factoryID.factoryName}"/>
                        </p:column>

                        <p:column>
                            <f:facet name="header">
                                <h:outputText value="العدد"/>
                            </f:facet>
                            <h:outputText value="#{item.packageCount}"/>
                        </p:column>

                        <p:column>
                            <f:facet name="header">
                                <h:outputText value="الوزن"/>
                            </f:facet>
                            <h:outputText value="#{item.itemAmount}"/>
                        </p:column>

                        <p:column>
                            <f:facet name="header">
                                <h:outputText value="اقل تاريخ صلاحيه"/>
                            </f:facet>
                            <h:outputText value="#{item.itemEXPDate}">
                                <f:convertDateTime pattern="MM/dd/yyyy HH:mm:ss" />
                            </h:outputText>
                        </p:column>

                        <p:column>
                            <f:facet name="header">
                                <h:outputText value="سعر الوحده"/>
                            </f:facet>
                            <h:outputText value="#{item.itemPrice}"/>
                        </p:column>

                        <p:column>
                            <f:facet name="header">
                                <h:outputText value="اجمالي السعر للوحده"/>
                            </f:facet>
                            <h:outputText value="#{item.totalPrice}"/>
                        </p:column>
                        </p:dataTable>
                </h:panelGroup>
                <!-- end of the table -->

                <div class="form-inline">
                    <label style="padding-left: 10px; padding-right: 300px;" for="input13">إجمالى الفواتير</label>
                    <h:outputText value="#{exporterController.billTotal}"/>

                    <label style="padding-left: 10px; padding-right: 20px;" for="input14">المدفوع</label>
                    <h:outputText value="#{exporterController.billCach}"/>

                    <label style="padding-left: 10px; padding-right: 20px;" for="input15">الباقى</label>
                    <h:outputText value="#{exporterController.billRemainder}"/>

                    <label style="padding-left: 10px; padding-right: 20px;" for="input15">الخصم</label>
                    <h:outputText value="#{exporterController.discount}"/>
                </div>
                <!-- end of the container -->
            </h:form>
        </ui:define>
    </ui:composition>
</html>